<template>
  <div>
    <h1>Sub App 2 - Home Page</h1>
    <img src="@/assets/big.png" alt="" />
    <div>
      <button @click="handleClick">跳转到about</button>
      <template v-if="isMicroApp">
        <button @click="handleGoMain('/about')">跳转到主应用 about 页</button>
        <button @click="handleClickSubApp1">跳转到sub-app-1</button>
      </template>
    </div>
    <h1>
      {{ route.path }}
    </h1>
  </div>
</template>

<script setup>
import { useRoute, useRouter } from "vue-router";
import { customLog } from "@/utils/log";
const route = useRoute();
const router = useRouter();

const isMicroApp = window?.__MICRO_APP_ENVIRONMENT__;

const handleClick = () => {
  router.push("/about");
};
const handleSendData = (data) => {
  window.microApp.dispatch(data, (res) => {
    customLog("数据发送成功！");
    if (res) {
      customLog("收到主应用的回复：", res);
    }
  });
};
const handleGoMain = (path) => {
  router.push(path);
};
</script>

<style scoped>
img {
  width: 500px;
  height: 350px;
}
</style>
